<template>
  <h3>组合api - reactive</h3>
  <p>{{ data.count }}</p>
  <button @click="fn">btn</button>
</template>

<script>
// reactive也是用来定义响应式数据
// reactive可以用来一次性定义多个变量
import { reactive } from "vue";
export default {
  setup() {
    const data = reactive({
      count: 3,
      msg: "hello",
      num: 10,
    });

    const fn = () => {
      data.count++;
    };

    return {
      data,
      fn,
    };
  },
};
</script>
